<template>
  <div class="card-table">
    <el-dialog
      :visible.sync="centerDialogVisible"
      width="45%"
      center
      :before-close="() => $emit('dialogQuxiao')"
    >
      <div class="header">
        <div
          style="
            margin-left: 11px;
            font-size: 17px;
            color: #22a1ff;
            font-weight: 500;
          "
        >
          {{ name }}工单
        </div>
      </div>
      <div class="main">
        <div style="margin-bottom: 20px">
          <span style="margin-left: 205px; font-size: 18px">来 源</span
          ><span style="margin-left: 300px; font-size: 18px">流 转</span>
        </div>
        <el-form
          size="small"
          :rules="rules"
          ref="form"
          :model="form"
          label-width="80px"
        >
          <el-form-item label="类型" prop="mold" class="items">
            <el-input style="width: 300px" v-model="form.mold" :disabled="true">
            </el-input>
          </el-form-item>
          <el-form-item prop="moldOut" class="itemss">
            <el-select
              style="width: 300px"
              v-model="moldOut"
              placeholder="请选择类型"
            >
              <el-option label="电极" value="电极"></el-option>
              <el-option label="坩埚" value="坩埚"></el-option>
              <el-option label="接头" value="接头"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="型号" prop="whatModel" class="items">
            <el-input
              style="width: 300px"
              v-model="form.whatModel"
              :disabled="true"
            >
            </el-input>
          </el-form-item>
          <el-form-item prop="whatModelOut" class="itemss">
            <el-select
              style="width: 300px"
              v-model="whatModelOut"
              placeholder="请选择型号"
              filterable
              clearable
            >
              <el-option
                v-for="(item, index) in WhatModelData"
                :key="index"
                :label="item"
                :value="item"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="工艺" prop="originCraft" class="items">
            <el-input
              style="width: 300px"
              v-model="form.originCraft"
              :disabled="true"
            >
            </el-input>
          </el-form-item>
          <el-form-item prop="gowhereCraft" class="itemss">
            <el-select
              style="width: 300px"
              v-model="gowhereCraft"
              placeholder="请选择工艺"
              filterable
              clearable
            >
              <el-option
                v-for="(item, index) in CraftData"
                :key="index"
                :label="item"
                :value="item"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="直径" prop="diameterOut" class="items">
            <el-input
              style="width: 300px"
              v-model="form.diameterOut"
              :disabled="true"
            >
            </el-input>
          </el-form-item>
          <el-form-item prop="diameterIn" class="itemss">
            <el-select
              style="width: 300px"
              v-model="diameterIn"
              placeholder="请选择直径"
              filterable
              clearable
            >
              <el-option
                v-for="(item, index) in DiameterData"
                :key="index"
                :label="item"
                :value="item"
              ></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="长度" prop="lengthOut" class="items">
            <el-input
              style="width: 300px"
              v-model="form.lengthOut"
              :disabled="true"
            >
            </el-input>
          </el-form-item>
          <el-form-item prop="lengthIn" class="itemss">
            <el-select
              style="width: 300px"
              v-model="lengthIn"
              placeholder="请选择长度"
              filterable
              clearable
            >
              <el-option
                v-for="(item, index) in LengthData"
                :key="index"
                :label="item.dates"
                :value="item.dates"
              ></el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="状态" prop="status" class="items">
            <el-input
              style="width: 300px"
              v-model="form.status"
              :disabled="true"
            >
            </el-input>
          </el-form-item>
          <el-form-item prop="statusOut" class="itemss">
            <el-select
              style="width: 300px"
              v-model="statusOut"
              placeholder="请选择状态"
            >
              <el-option label="一焙" value="一焙"></el-option>
              <el-option label="二焙" value="二焙"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="归属" prop="affiliation" class="items">
            <el-input
              style="width: 300px"
              v-model="form.affiliation"
              :disabled="true"
            >
            </el-input>
          </el-form-item>
          <el-form-item prop="affiliationOut" class="itemss">
            <el-select
              style="width: 300px"
              v-model="affiliationOut"
              placeholder="请选择归属"
            >
              <el-option label="本厂" value="本厂"></el-option>
              <el-option label="客户" value="客户"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="正次品" prop="good" class="items">
            <el-input style="width: 300px" v-model="form.good" :disabled="true">
            </el-input>
          </el-form-item>
          <el-form-item prop="goodOut" class="itemss">
            <el-select
              style="width: 300px"
              v-model="goodOut"
              placeholder="请选择正次品"
            >
              <el-option label="正品" value="正品"></el-option>
              <el-option label="次品" value="次品"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="客户" prop="Customer" class="items">
            <el-input
              style="width: 300px"
              v-model="Customer"
              placeholder="请输入客户名称"
            >
            </el-input>
          </el-form-item>
          <el-form-item label="批 号" prop="lotNumber" class="items">
            <el-input
              style="width: 250px"
              v-model="lotNumber"
              placeholder="请输入批 号"
            >
            </el-input>
          </el-form-item>
          <el-form-item label="数量" prop="number" class="items">
            <el-input
              style="width: 300px"
              v-model="number"
              placeholder="请输入数量"
            >
            </el-input>
          </el-form-item>
          <el-form-item label="外协地" prop="outside" class="items">
            <el-input
              style="width: 250px"
              v-model="outside"
              placeholder="请输入外协地"
            >
            </el-input>
          </el-form-item>

          <el-form-item label="备注" prop="remark" class="items">
            <el-input
              type="textarea"
              :autosize="{ minRows: 2, maxRows: 4 }"
              style="width: 300px"
              v-model="remark"
            >
            </el-input>
          </el-form-item>
          <el-form-item
            label="填写人"
            prop="inputPeople"
            class="items"
            style="position: relative; top: -16px"
          >
            <el-input
              style="width: 250px"
              v-model="inputPeople"
              placeholder="请输入填写人"
            >
            </el-input>
          </el-form-item>
        </el-form>
      </div>

      <span slot="footer" class="dialog-footer">
        <el-button @click="$emit('dialogQuxiao'), (form = {})">取 消</el-button>
        <el-button type="primary" @click="resetForm">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import {
  NewLIUZHUANcreate,
  CraftgetAll,
  NewLIUZHUANupdate,
} from "@/api/stock/banlance3.js";
import { LengthgetAll } from "@/api/stock/totalListWorkOrder.js";
import { DiametergetAll } from "@/api/stock/diameter.js";
import { WhatModelgetAll } from "@/api/stock/whatmodel.js";
export default {
  components: {},
  props: ["dialogVisible", "rowa", "names"],
  emits: ["dialogQuxiao"],
  data() {
    return {
      form: {},
      DiameterData: [],
      CraftData: [],
      LengthData: [],
      WhatModelData: [],
      rules: {},
      centerDialogVisible: this.dialogVisible,
      name: this.names,
      gowhereCraft: "",
      affiliationOut: "",
      statusOut: "",
      moldOut: "",
      whatModelOut: "",
      goodOut: "",
      diameterIn: "",
      lengthIn: "",
      remark: "",
      number: "",
      outside: "",
      inputPeople: "",
      Customer: "",
      lotNumber: "",
    };
  },

  computed: {},
  watch: {
    dialogVisible(n) {
      this.centerDialogVisible = n;
    },
    names(n) {
      this.name = n;
    },
    rowa(n) {
      if (n != 1) {
        console.log(n);
        this.form.diameterOut = n.diameterOut ? n.diameterOut : n.diameter;
        this.diameterIn = n.diameterIn ? n.diameterIn : n.diameter;
        this.form.lengthOut = n.lengthOut ? n.lengthOut : n.length;
        this.lengthIn = n.lengthIn ? n.lengthIn : n.length;
        this.form.good = n.good ? n.good : n.goodOrBad;
        this.goodOut = n.goodOut ? n.goodOut : n.goodOrBad;
        this.form.whatModel = n.whatModel;
        this.whatModelOut = n.whatModelOut ? n.whatModelOut : n.whatModel;
        this.form.mold = n.mold;
        this.moldOut = n.moldOut ? n.moldOut : n.mold;
        this.form.status = n.status;
        this.statusOut = n.statusOut ? n.statusOut : n.status;
        this.form.affiliation = n.affiliation;
        this.affiliationOut = n.affiliationOut
          ? n.affiliationOut
          : n.affiliation;
        this.form.originCraft = n.originCraft ? n.originCraft : n.craft;
        this.gowhereCraft = n.goWhereCraft ? n.goWhereCraft : n.craft;
        this.remark = n.remark;
        this.number = n.number;
        this.outside = n.outside;
        this.inputPeople = n.inputPeople;
        this.Customer = n.Customer;
        this.lotNumber = n.lotNumber;
      }
    },
  },
  created() {
    LengthgetAll().then((res) => {
      this.LengthData = res.data.data.pageData;
    });
    //获取工艺
    CraftgetAll().then((res) => {
      const pageData = res.data.data.pageData;
      pageData.forEach((element) => {
        this.CraftData.push(element.dates);
      });
    });
    //获取直径
    DiametergetAll().then((res) => {
      const pageData = res.data.data.pageData;
      pageData.forEach((element) => {
        this.DiameterData.push(element.dates);
      });
    });
    //获取类型
    WhatModelgetAll().then((res) => {
      const pageData = res.data.data.pageData;
      pageData.forEach((element) => {
        this.WhatModelData.push(element.dates);
      });
      console.log(this.WhatModelData);
    });
  },
  mounted() {},
  methods: {
    async resetForm() {
      this.form.workOrderType = this.name;
      this.form.gowhereCraft = this.gowhereCraft;
      this.form.affiliationOut = this.affiliationOut;
      this.form.statusOut = this.statusOut;
      this.form.moldOut = this.moldOut;
      this.form.whatModelOut = this.whatModelOut;
      this.form.goodOut = this.goodOut;
      this.form.diameterIn = this.diameterIn;
      this.form.lengthIn = this.lengthIn;
      this.form.remark = this.remark;
      this.form.number = parseFloat(this.number);
      this.form.outside = this.outside;
      this.form.inputPeople = this.inputPeople;
      this.form.Customer = this.Customer;
      this.form.lotNumber = this.lotNumber;
      console.log(this.form, 123);
      let datas;
      if (this.$route.fullPath === "/balancegd") {
        const { data } = await NewLIUZHUANupdate(this.form);
        datas = data;
      } else {
        const { data } = await NewLIUZHUANcreate(this.form);
        datas = data;
      }
      if (datas.code == 200) {
        this.$message({
          type: "success",
          message: `${this.name}${datas.message}`,
        });
      } else {
        this.$message({
          type: "error",
          message: `${this.name}${datas.message}`,
        });
      }
      this.form = {};
      this.$emit("dialogQuxiao");
    },
  },
};
</script>

<style  scoped>
.card-table {
  padding: 0;
}
.header {
  display: flex;
  align-items: center;
  padding: 18px;
  border-bottom: thin solid rgb(223, 223, 223);
}
.main {
  width: 800px;
  padding: 20px;

  .items {
    display: inline-block;
  }
  .itemss {
    margin-left: -50px;
    display: inline-block;
  }
}
.footer {
  padding: 20px;
}
</style>
